<?php

?>
<!doctype>
<html>
	<head>
	<link type="text/css" rel="stylesheet" href="css/list.css" />
	<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
	<script type="text/javascript" src="js/jquery.json-2.2.min.js"></script>
	<script type="text/javascript">
		var currpage = 1;
		var currorder = "";
		var link_details = [];
		
		function appendrows(page, order, callback) {
			currpage = page;
			currorder = order;
			
			$.ajax({
				url: "svc.php",
				data: ({
					method: "getrecord",
					params: "{\"page\":" + page + ", \"order\":\"" + order + "\"}"
				}),
				async: true,
				type: "POST",
				//dataType: 'json',
				success: function(data, textStatus) {
					$("#grid-files tbody").append(data);
					setWidth($("#grid-files"));
					
					if(typeof(callback) == "function") {
						callback.handler.call(callback.scope, data, page, order);
					}
				}
			});					
		}
		
		function find(array, el, handler) {
			var i = 0;
			found = -1;
			while(found == -1 && i < array.length) {
				if(handler(array[i], el)) {
					found = i;
				}
				i++;
			}
			
			return found;
		}
		
		function next(array, el) {
			var next = null;
			if(array && array.length > 0) {
				if (el) {
					var index = find(array, el, function(item, elem){
						return item.o == elem;
					});
					
					next = index > -1 && (index + 1) < array.length ? array[index + 1] : array[0];
				} else {
					next = array[0];
				}
			}
			
			return next;
		}
		
		function setOrder(col) {
			var order = next(col.attr("x-order-avail") ? $.evalJSON(col.attr("x-order-avail")) : [], col.attr("x-order"));
			if(order) {
				col.attr("x-order", order.o);					
				col.addClass("order " + order.t);
				
				$("#grid-files tbody").empty();
				
				new function(handlerappend) {
					this.handler = function(data, page, order) {
						if(page < this.pages) {
							handlerappend(page + 1, order, { handler: this.handler, scope: this});
						}
					};
					this.pages = currpage;
				}(appendrows).handler(null, 0, order.o);
				
				//appendrows(1, order.o, { handler: obj.handler, scope: obj});
			}
		}
		
		function download(idlist) {
			if (idlist && idlist.length > 0) {
				$.ajax({
					url: "svc.php",
					data: ({
						method: "download",
						params: "{\"id\":" + $.toJSON(idlist) + "}"
					}),
					async: true,
					type: "POST",
					success: function(data, textStatus){
						var dialog = $("#download-dialog-message");
						dialog.empty();
						dialog.append(data);
						dialog.show(100);
						
						setTimeout(function(){
							dialog.hide(100);
						}, 6000);
					}
				});
			}
		}
		
		function backgroundFlashing(selector)
		{
			setInterval(function() {
				$(selector).toggleClass("on");
			},800);
		}
		
		function showLinkDetails(ref) {
			for(var item in link_details) {
				if(/^[\d]+$/i.test(item)) {
					link_details[item].hide();
				}
			}
			
			var id = ref.parents("tr").attr("fileid");
			
			if (!link_details[id]) {
				$(document.body).append("<div id=\"ld-" + id +"\" style=\"left:" + ref.offset().left + "px; top:" + (ref.offset().top + 18) + "px;\" class=\"dialog-details\"><a href=\"#\" class=\"close\"><img src=\"\" border=\"0\" /></a><div class=\"link\"><span>" + ref.html() + "</span></div></div>");
				link_details[id] = $("#ld-" + id);
				link_details[id].find("a.close").click(function(event) {
					event.preventDefault();
					$(this).parent(".dialog-details").hide();
				});
			} else {
				link_details[id].show();
			}
		}
		
		function setWidth(table) {
			var width = $(window).width() - 20;
			var thead_childs = table.find("thead > tr > td");
			
			table.find("tbody > tr > td > div").each(function(el) {
				var w = $(thead_childs[el % thead_childs.length]).attr("x-width");
				var margin = parseInt($(this).css("margin-left").replace(/px/,"")) + parseInt($(this).css("margin-right").replace(/px/,""));
				
				$(this).width(width / 100 * w - margin);
			});
		}
		
		function setcheckedAll(status) {
			$("#grid-files td.checks input[type=checkbox]").attr("checked", status);
		}
		
		function downloadAll() {
			var checked = [];
			$("#grid-files td.checks input[type=checkbox]:checked").each(function() {
				var status = parseInt($(this).parents("tr").attr("status"));
				if (status == 0 || status == 2) {
					checked.push($(this).val());
				}
			});
			
			if(checked.length > 0) {
				download(checked);
			}
		}
		
		$(document).ready(function() {
			var table = $("#grid-files");
			table.width($(window).width() - 20);

			appendrows(1, "");
			
			$("#button-append > input[type=button]").click(function() {
				appendrows(currpage + 1, currorder);
				this.blur();
			});
			
			backgroundFlashing("#grid-files tr.status-3 td");
			$("#grid-files td.link > div").live("click", function(event) {
				showLinkDetails($(this));
			});
			
			$("#grid-files > thead > tr:first > td > div").click(function(ev) {
				var currorder = $("#grid-files > thead > tr:first > td > div.order");
				if (currorder) {
					currorder.removeAttr("x-order");
					currorder.removeClass("order").removeClass("asc").removeClass("desc");
				}
				
				setOrder($(this));
			});
		});
	</script>
	</head>
	<body>
		<div class="search">
			
		</div>
		<table id="grid-files" cellpadding="0" cellspacing="0">
			<thead>
				<tr>
				<td x-width="2"></td>
				<td x-width="2.3">id</td>
				<td x-width="25"><div x-order-avail="[{\"o\":\"na\", t:\"asc\"}, {\"o\":\"nd\", t:\"asc\"}]">nome file</div></td>
				<td x-width="28.5">link ed2k</td>
				<td x-width="16">directory di destinazione</td>
				<td x-width="7.2">modo</td>
				<td x-width="12">data</td>
				<td x-width="7"></td>
				</tr>
				</thead>
			<tbody></tbody>
			<tfoot>
				<tr>
					<td colspan="8">
						<img src="css/images/arrow_ltr.png" style="margin-left:4px;"/><a href="javascript:setcheckedAll(true)">Seleziona tutti</a> / <a href="javascript:setcheckedAll(false)">Deseleziona tutti</a> - Se Selezionati: <a href="javascript:downloadAll()"><img class="start" src="" border="0" /></a><a href="javascript:stopdownloadAll()"><img class="stop" src="" border="0" /></a><a href="javascript:removedownloadAll()"><img class="remove" src="" border="0" /></a>
					</td>
				</tr>
			</tfoot>
		</table>
		<div id="button-append"><input type="button" value="Altri Risultati"/></div>
		<div id="download-dialog-message"></div>
	</body>
</html>

